<template>
  <div id="a1">
    <Navbar></Navbar>
    <div id="a2">
      <div class="one">
        <span for="">用户名</span>
        <br>
        <br>
        <input class="aaa" type="text" v-model="name">
      </div>
      <br>
      <div class="one">
        <span for="">密码</span>
        <br>
        <br>
        <input class="aaa" type="text" v-model="psw">
      </div>

      <br>
      <input id="p" type="checkbox"><span>记住我</span>
      <br>
      <br>
      <div id="btn">
        <button @click="login">登 录</button>
      </div>
    </div>
  </div>
</template>

<script>
  import Navbar from "../components/Navbar.vue"
  export default {
    components:{ Navbar },
    data:function(){
      return {
        name:"",
        psw:"",
        isLogin:false
      }
    },
    methods:{
      login(){
        var data = {
          username:this.name,
          psw:this.psw,
        }
        this.$store.dispatch("login",data);
      }
    }
  }

</script>

<style scoped>
.aaa{
  width: 90%;
  height: 25px;
  /*text-align: center;*/
}
#a1{
  text-align: center;
  /*border: 1px solid black;*/
}
#a2{
  display: inline-block;
  text-align: left;
  /*border: 1px solid black;*/
  width: 90%;
}
#p{
  width: 10px;
  height: 10px;
  border-radius: 50%;
}
</style>